Tailwind CSS
Color Generator

Enter a hexcode to create a custom color scale

Random
Magenta / Fuchsia
50
fff3ff
100
fde6ff
200
fcccff
300
fda4ff
400
fd6eff
500
f637fe
600
e526e9
700
bc0fbc
800
990f97
900
7d1279
950
540050
Examples
Customers
1,553
New customers in past 30 days
Revenue
$12,543
Jan
Feb
Mar
Apr
May
Jun
Today
Design system meeting
9 - 10 AM
Lunch
1 - 2 PM
Design review
3 - 4 PM
Create
color scales
in seconds.
Create
color scales
in seconds.
Create
color scales
in seconds.
Buttons · Flat
Default
Hover
Active
Disabled
Buttons · Outline
Default
Hover
Active
Disabled
Buttons · Bezel
Default
Hover
Active
Disabled
Got feedback?
We'd love to know what you think about UI Colors.